<!--
 * @Description: 新增固定页面
 * @Date: 2020-12-10 10:49:33
 * @LastEditors: lother
 * @LastEditTime: 2021-01-12 15:38:44
 * @FilePath: \AccounOpening-WEB\src\views\openProcess\Hopen\addPage.vue
-->
<template>
  <div>
    <el-dialog
      :title="(id? $t('Hopen.addPage.56cjhnymlzc0') : $t('Hopen.addPage.56cjhnymn5c0') )+ $t('Hopen.addPage.56cjhnymng80') "
      :visible.sync="dialogVisible"
      :before-close="close"
      width="700px"
    >
      <el-form
        :model="ruleForm"
        ref="ruleForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <!-- 自定义 -->
        <el-form-item :label="$t('Hopen.addPage.56cjejxe4ew0')">
          <el-select
            v-model="ruleForm.pageId"
            :placeholder="$t('Hopen.addPage.56cjejxe5kc0')"
            clearable
            @change="imgChange"
            :disabled="id?true:false"
          >
            <el-option
              v-for="item in list"
              :key="item.url"
              :label="item['label_'+langSufx]"
              :value="item.url"
              :disabled="disabledList(item.url)"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item :label="$t('Hopen.addPage.56cjejxe5us0')">
          <el-popover placement="right" trigger="hover" :disabled="!imgShow">
            <img :src="img" style="max-height: 600px" />
            <el-image
              fit="cover"
              slot="reference"
              :src="img"
              style="width: 150px; height: 150px; cursor: pointer"
            >
              <div slot="error" class="image-slot">
                <i class="el-icon-picture-outline"></i>
              </div>
            </el-image>
          </el-popover>
        </el-form-item>
        <div v-if="show">
          <div v-for="(item, index) in pageItemList.branch" :key="index">
            <div v-for="(itemChild, childIndex) in item" :key="childIndex">
              <el-form-item
                :label="
                  itemChild['name_' + langSufx] +
                  (typeof itemChild.top_tip_zh ? '' : '')
                "
                v-if="(typeof itemChild.top_tip_zh) !== 'undefined'"
              >
                <el-input
                  :placeholder="$t('Hopen.addPage.56cjejxe6300')+$t('openProcess.RightPanel.56ckprv6wc00')"
                  type="textarea"
                  :autosize="{ minRows: 4 }"
                  v-model="itemChild.top_tip_zh"
                  clearable
                ></el-input>
                <el-input
                  :placeholder="$t('Hopen.addPage.56cjejxe6300')+$t('openProcess.RightPanel.56ckprv6xec0')"
                  type="textarea"
                  :autosize="{ minRows: 4 }"
                  v-model="itemChild.top_tip_en"
                  clearable
                ></el-input>
                <el-input 
                  :placeholder="$t('Hopen.addPage.56cjejxe6300')+$t('openProcess.RightPanel.56ckprv6xec01')"
                  type="textarea"
                  :autosize="{ minRows: 4 }"
                  v-model="itemChild.top_tip_tc"
                  clearable
                ></el-input>
              </el-form-item>
              <el-form-item
                :label="
                  itemChild['name_' + langSufx] +
                  (typeof itemChild.bottom_tip_zh ? '' : '')
                "
                v-if="(typeof itemChild.bottom_tip_zh) !== 'undefined'"
              >
                <el-input
                  :placeholder="$t('Hopen.addPage.56cjejxe6300')+$t('openProcess.RightPanel.56ckprv6wc00')"
                  type="textarea"
                  :autosize="{ minRows: 4 }"
                  v-model="itemChild.bottom_tip_zh"
                  clearable
                ></el-input>
                <el-input
                  :placeholder="$t('Hopen.addPage.56cjejxe6300')+$t('openProcess.RightPanel.56ckprv6xec0')"
                  type="textarea"
                  :autosize="{ minRows: 4 }"
                  v-model="itemChild.bottom_tip_en"
                  clearable
                ></el-input>
                <el-input
                  :placeholder="$t('Hopen.addPage.56cjejxe6300')+$t('openProcess.RightPanel.56ckprv6xec01')"
                  type="textarea"
                  :autosize="{ minRows: 4 }"
                  v-model="itemChild.bottom_tip_tc"
                  clearable
                ></el-input>
              </el-form-item>
            </div>
          </div>
        </div>
      </el-form>

      <span
        slot="footer"
        class="dialog-footer"
        v-if="checkPermission(['openFlow@save','openFlow@update'])"
      >
        <el-button @click="close">{{$t('Hopen.addPage.56cjejxe6k00')}}</el-button>
        <el-button type="primary" @click="submit">{{$t('Hopen.addPage.56cjejxe6rw0')}}</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { pageTpyeList } from "@/assets/js/common";
import { addPage, editPage, getFlow } from "@/api/openProcess/Hopen";

export default {
  props: {
    pageType: {
      type: String,
      default: "",
    },
    fixedList: {
      type: Array,
      default: [],
    },
  },
  computed: {
    langSufx() {
      return this.$store.state.settings.langTail;
    },
    inlandImgList() {
      var list = [
        {
          img_zh: require("@/assets/images/chinaCard.jpg"),
          img_en: require("@/assets/images/chinaCard_en.jpg"),
          img_tc: require("@/assets/images/chinaCard_tc.jpg"),
          label_zh: this.$t('Hopen.addPage.zh.56cjejxe6zw0'),
          label_en: this.$t('Hopen.addPage.en.56cjejxe6zw0'),
          label_tc:this.$t('Hopen.addPage.tc.56cjejxe6zw0'),
          url: "mainlandCard",
          list: {
            name_zh: this.$t('Hopen.addPage.zh.56cjejxe6zw0'),
            name_en: this.$t('Hopen.addPage.en.56cjejxe6zw0'),
            name_tc: this.$t('Hopen.addPage.tc.56cjejxe6zw0'),
            type: "1",
            url_path: "mainlandCard",
            user_type: "1",
            fields: [
              ...this.uploadList(
                this.$t('Hopen.addPage.zh.56cjejxe7gs0'),
                this.$t('Hopen.addPage.en.56cjejxe7gs0'),
                this.$t('Hopen.addPage.tc.56cjejxe7gs0'),
                "frontImg"),
              ...this.uploadList(
                this.$t('Hopen.addPage.zh.56cjejxe7oo0'), 
                this.$t('Hopen.addPage.en.56cjejxe7oo0'),
                this.$t('Hopen.addPage.tc.56cjejxe7oo0'),
                "backImg"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxe7ww0'),
                this.$t('Hopen.addPage.en.56cjejxe7ww0'),
                this.$t('Hopen.addPage.tc.56cjejxe7ww0'),
                 "realName"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxe84w0'),
                this.$t('Hopen.addPage.en.56cjejxe84w0'),
                this.$t('Hopen.addPage.tc.56cjejxe84w0'),
                 "pinyin"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxe8dg0'),
                this.$t('Hopen.addPage.en.56cjejxe8dg0'),
                this.$t('Hopen.addPage.tc.56cjejxe8dg0'),
                 "sex"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxe8ls0'),
                this.$t('Hopen.addPage.en.56cjejxe8ls0'),
                this.$t('Hopen.addPage.tc.56cjejxe8ls0'),
                 "nation"),
              ...this.dateList(
                this.$t('Hopen.addPage.zh.56cjejxe8ug0'),
                this.$t('Hopen.addPage.en.56cjejxe8ug0'),
                this.$t('Hopen.addPage.tc.56cjejxe8ug0'),
                 "birth"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxe92o0'),
                this.$t('Hopen.addPage.en.56cjejxe92o0'),
                this.$t('Hopen.addPage.tc.56cjejxe92o0'),
                 "idCard"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxe9ao0'),
                this.$t('Hopen.addPage.en.56cjejxe9ao0'),
                this.$t('Hopen.addPage.tc.56cjejxe9ao0'),
                 "address"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxe9ik0'),
                this.$t('Hopen.addPage.en.56cjejxe9ik0'),
                this.$t('Hopen.addPage.tc.56cjejxe9ik0'),
                 "signOffice"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxe9r80'),
                this.$t('Hopen.addPage.en.56cjejxe9r80'),
                this.$t('Hopen.addPage.tc.56cjejxe9r80'),
                 "signDate"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxea180'),
                this.$t('Hopen.addPage.en.56cjejxea180'),
                this.$t('Hopen.addPage.tc.56cjejxea180'),
                 "expireDate"),
            ],
          },
        },
        {
          img_zh: require("@/assets/images/CA.jpg"),
          img_en: require("@/assets/images/CA_en.jpg"),
          img_tc: require("@/assets/images/CA_tc.jpg"),
          label_zh:this.$t('Hopen.addPage.zh.56cjk5d0x9k0'),
          label_en:this.$t('Hopen.addPage.en.56cjk5d0x9k0'),
          label_tc:this.$t('Hopen.addPage.tc.56cjk5d0x9k0'),
          url: "CAvideo",
          list: {
            name_zh: this.$t('Hopen.addPage.zh.56cjk5d0x9k0'),
            name_en: this.$t('Hopen.addPage.en.56cjk5d0x9k0'),
            name_tc: this.$t('Hopen.addPage.tc.56cjk5d0x9k0'),
            type: "1",
            url_path: "CAvideo",
            user_type: "1",
            fields: [...this.videoList(
              this.$t('Hopen.addPage.zh.56cjejxea8k0'), 
              this.$t('Hopen.addPage.en.56cjejxea8k0'), 
              this.$t('Hopen.addPage.tc.56cjejxea8k0'), 
              "videoUrl")],
          },
        },
        {
          img_zh: require("@/assets/images/graph.jpg"),
          img_en: require("@/assets/images/graph_en.jpg"),
          img_tc: require("@/assets/images/graph_tc.jpg"),
          label_zh: this.$t('Hopen.addPage.zh.56cjejxeag00'),
          label_en: this.$t('Hopen.addPage.en.56cjejxeag00'),
          label_tc: this.$t('Hopen.addPage.tc.56cjejxeag00'),
          url: "autograph",
          list: {
            name_zh: this.$t('Hopen.addPage.zh.56cjejxeag00'),
            name_en: this.$t('Hopen.addPage.en.56cjejxeag00'),
            name_tc: this.$t('Hopen.addPage.tc.56cjejxeag00'),
            type: "1",
            url_path: "autograph",
            user_type: "1",
            fields: [
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxeamw0'), 
                this.$t('Hopen.addPage.en.56cjejxeamw0'), 
                this.$t('Hopen.addPage.tc.56cjejxeamw0'), 
                "sign",'input-images'), 
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxeatg0'), 
                this.$t('Hopen.addPage.en.56cjejxeatg0'), 
                this.$t('Hopen.addPage.tc.56cjejxeatg0'), 
                "signDate")
              ],
          },
        },
      ];
      return list;
    },
    HKImgList() {
      return [
        {
          img_zh: require("@/assets/images/gui.jpg"),
          img_en: require("@/assets/images/gui_en.jpg"),
          img_tc: require("@/assets/images/gui_tc.jpg"),
          label_zh: this.$t('Hopen.addPage.zh.56cjejxeb040'),
          label_en: this.$t('Hopen.addPage.en.56cjejxeb040'),
          label_tc: this.$t('Hopen.addPage.tc.56cjejxeb040'),
          url: "verification?type=web",
          list: this.HKOther(this.$t('Hopen.addPage.zh.56cjejxeb040'),this.$t('Hopen.addPage.en.56cjejxeb040'),this.$t('Hopen.addPage.tc.56cjejxeb040'), 2),
        },
        {
          img_zh: require("@/assets/images/see.jpg"),
          img_en: require("@/assets/images/see_en.jpg"),
          img_tc: require("@/assets/images/see_tc.jpg"),
          label_zh: this.$t('Hopen.addPage.zh.56cjejxeb6o0'),
          label_en: this.$t('Hopen.addPage.en.56cjejxeb6o0'),
          label_tc: this.$t('Hopen.addPage.tc.56cjejxeb6o0'),
          url: "verification?type=local",
          list: this.HKOther(this.$t('Hopen.addPage.zh.56cjejxeb6o0'),this.$t('Hopen.addPage.en.56cjejxeb6o0'),this.$t('Hopen.addPage.tc.56cjejxeb6o0'), 1),
        },
        {
          img_zh: require("@/assets/images/all.jpg"),
          img_en: require("@/assets/images/all_en.jpg"),
          img_tc: require("@/assets/images/all_tc.jpg"),
          label_zh: this.$t('Hopen.addPage.zh.56cjejxebdc0'),
          label_en: this.$t('Hopen.addPage.en.56cjejxebdc0'),
          label_tc: this.$t('Hopen.addPage.tc.56cjejxebdc0'),
          url: "verification",
          list: this.HKOther(this.$t('Hopen.addPage.zh.56cjejxebdc0'),this.$t('Hopen.addPage.en.56cjejxebdc0'),this.$t('Hopen.addPage.tc.56cjejxebdc0')),
        },
        {
          img_zh: require("@/assets/images/graph.jpg"),
          img_en: require("@/assets/images/graph_en.jpg"),
          img_tc: require("@/assets/images/graph_tc.jpg"),
          label_zh: this.$t('Hopen.addPage.zh.56cjejxeag00'),
          label_en: this.$t('Hopen.addPage.en.56cjejxeag00'),
          label_tc: this.$t('Hopen.addPage.tc.56cjejxeag00'),
          url: "autograph",
          list: {
            name_zh: this.$t('Hopen.addPage.zh.56cjejxeag00'),
            name_en: this.$t('Hopen.addPage.en.56cjejxeag00'),
            name_tc: this.$t('Hopen.addPage.tc.56cjejxeag00'),
            type: "1",
            url_path: "autograph",
            user_type: "2",
            fields: [
              ...this.inputList(this.$t('Hopen.addPage.zh.56cjejxeamw0'),this.$t('Hopen.addPage.en.56cjejxeamw0'),this.$t('Hopen.addPage.tc.56cjejxeamw0'), "sign",'input-images'), 
              ...this.inputList(this.$t('Hopen.addPage.zh.56cjejxeatg0'),this.$t('Hopen.addPage.en.56cjejxeatg0'),this.$t('Hopen.addPage.tc.56cjejxeatg0'), "signDate")
              ],
          },
        },
      ];
    },
    otherList() {
      return [
        {
          img_zh: require("@/assets/images/gui.jpg"),
          img_en: require("@/assets/images/gui_en.jpg"),
          img_tc: require("@/assets/images/gui_tc.jpg"),
          label_zh: this.$t('Hopen.addPage.zh.56cjejxeb040'),
          label_en: this.$t('Hopen.addPage.en.56cjejxeb040'),
          label_tc: this.$t('Hopen.addPage.tc.56cjejxeb040'),
          url: "verification?type=web",
          list: this.HKOther(
            this.$t('Hopen.addPage.zh.56cjejxeb040'),
            this.$t('Hopen.addPage.en.56cjejxeb040'),
            this.$t('Hopen.addPage.tc.56cjejxeb040'),
             2),
        },
        {
          img_zh: require("@/assets/images/see.jpg"),
          img_en: require("@/assets/images/see_en.jpg"),
          img_tc: require("@/assets/images/see_tc.jpg"),
          label_zh: this.$t('Hopen.addPage.zh.56cjejxeb6o0'),
          label_en: this.$t('Hopen.addPage.en.56cjejxeb6o0'),
          label_tc: this.$t('Hopen.addPage.tc.56cjejxeb6o0'),
          url: "verification?type=local",
          list: this.HKOther(
            this.$t('Hopen.addPage.zh.56cjejxeb6o0'),
            this.$t('Hopen.addPage.en.56cjejxeb6o0'),
            this.$t('Hopen.addPage.tc.56cjejxeb6o0'),
             1),
        },
        {
          img_zh: require("@/assets/images/all.jpg"),
          img_en: require("@/assets/images/all_en.jpg"),
          img_tc: require("@/assets/images/all_tc.jpg"),
          label_zh: this.$t('Hopen.addPage.zh.56cjejxebdc0'),
          label_en: this.$t('Hopen.addPage.en.56cjejxebdc0'),
          label_tc: this.$t('Hopen.addPage.tc.56cjejxebdc0'),
          url: "verification",
          list: this.HKOther(
            this.$t('Hopen.addPage.zh.56cjejxebdc0'),
            this.$t('Hopen.addPage.en.56cjejxebdc0'),
            this.$t('Hopen.addPage.tc.56cjejxebdc0'),
            ),
        },
        {
          img_zh: require("@/assets/images/graph.jpg"),
          img_en: require("@/assets/images/graph_en.jpg"),
          img_tc: require("@/assets/images/graph_tc.jpg"),
          label_zh: this.$t('Hopen.addPage.zh.56cjejxeag00'),
          label_en: this.$t('Hopen.addPage.en.56cjejxeag00'),
          label_tc: this.$t('Hopen.addPage.tc.56cjejxeag00'),
          url: "autograph",
          list: {
            name_zh: this.$t('Hopen.addPage.zh.56cjejxeag00'),
            name_en: this.$t('Hopen.addPage.en.56cjejxeag00'),
            name_tc: this.$t('Hopen.addPage.tc.56cjejxeag00'),
            type: "1",
            url_path: "autograph",
            user_type: "3",
            fields: [
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxeamw0'),
                this.$t('Hopen.addPage.en.56cjejxeamw0'),
                this.$t('Hopen.addPage.tc.56cjejxeamw0'),
                 "sign",'input-images'), 
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxeatg0'), 
                this.$t('Hopen.addPage.en.56cjejxeatg0'), 
                this.$t('Hopen.addPage.tc.56cjejxeatg0'), 
                "signDate")
              ],
          },
        },
      ];
    },
    list() {
      if (this.pageType == 1) {
        return this.inlandImgList;
      } else if (this.pageType == 2) {
        return this.HKImgList;
      } else {
        return this.otherList;
      }
    },
  },
  data() {
    return {
      pageTpyeList,
      dialogVisible: false,
      ruleForm: {
        pageStutas: "",
        pageId: "",
        pageName: "",
      },
      item: {},
      img: "",
      show: false,
      pageItemList: {},
      imgShow: false,
      id: "",
    };
  },
  methods: {
    disabledList(val) {
      var boll = false;
      for (let index = 0; index < this.fixedList.length; index++) {
        const element = this.fixedList[index];
            var urlHref = (element.split('?'))[0]
        if (val.indexOf(urlHref) != -1) {
          boll = true;
        }
      }
      return boll;
    },
    init(type, id) {
      this.dialogVisible = true;
      this.id=(id ?? '')
      if (id) {
        getFlow(id).then((res) => {
          if (res.code == 10000) {
            this.ruleForm.pageId = res.data.url_path;
            this.initChange(this.ruleForm.pageId,res.data);
          }
        });
      }
    },
    submit() {
      if (this.id) {
        this.editPageList(this.id,this.pageItemList)
      } else {
        this.addPageList(this.pageItemList);
      }
    },
    editPageList(id,obj){
      editPage(id,obj).then(res=>{
        if (res.code == 10000) {
          this.close();
          this.$parent.getList();
        }
      })
    },
    addPageList(obj) {
      addPage(obj).then((res) => {
        if (res.code == 10000) {
          this.close();
          this.$parent.getList();
        }
      });
    },
    close() {
      this.id = "";
      this.dialogVisible = false;
      this.ruleForm.pageId = "";
      this.pageItemList = {};
      this.img = "";
      this.imgShow = this.img ? true : false;
      this.show = false;
    },
    initChange(val,list){
      var item = this.$options.filters["release"](val, this.list, "url", "obj");
      console.log(item,'initChange')
      this.img = item['img_'+this.langSufx] || "";
      this.imgShow = this.img ? true : false;
      var  { branch , name_en, name_zh , name_tc , url_path , user_type ,type , page_fields } =list;
      this.pageItemList = {branch : JSON.parse(branch) , name_en, name_zh , name_tc , url_path , user_type ,type ,fields:page_fields }
      //   this.pageItemList = item.list || {};
      this.show = false;
      var obj = this.pageItemList?.branch || {};
      if (JSON.stringify(obj) !== "{}") {
        this.show = true;
      }

// name_en: name,

//         type: "1",
//         url_path: "verification",
//         user_type: this.pageType,
//         branch: Object.assign({}, obj),
    },
    imgChange(val,list) {
      var item = this.$options.filters["release"](val, this.list, "url", "obj");
      console.log(item,'imgChange')
      this.img = item['img_'+this.langSufx] || "";
      this.imgShow = this.img ? true : false;
      
      this.pageItemList = item.list || {};
      console.log(item,this.pageItemList,'imgchange')
      this.show = false;
      if(this.pageItemList )
      var obj = this.pageItemList?.branch || {};
      if (JSON.stringify(obj) !== "{}") {
        this.show = true;
      }
    },
    inputList(name,name_en,name_tc, keyName,type) {
      type  = type || 'input'
      return [
        {
          type: type,
          title_zh: name,
          title_en: name_en,
          title_tc: name_tc,
          name: keyName,
          rule: [],
          maxlength: "",
          is_show_tag: 1,
          is_require: 1,
          is_disable: 0,
        },
      ];
    },
    uploadList(name,name_en,name_tc, keyName) {
      return [
        {
          type: "upload",
          title_zh: name,
          title_en: name_en,
          title_tc:name_tc,
          name: keyName,
          rule: [],
          is_show_tag: 1,
          is_require: 1,
          is_disable: 0,
        },
      ];
    },
    videoList(name ,name_en,name_tc, keyName) {
      return [
        {
          type: "video",
          title_zh: name,
          title_en: name_en,
          title_tc:name_tc,
          name: keyName,
          rule: [],
          is_show_tag: 1,
          is_require: 1,
          is_disable: 0,
        },
      ];
    },
    dateList(name,name_en,name_tc, keyName) {
      return [
        {
          type: "date",
          title_zh: name,
          title_en: name_en,
          title_tc: name_tc,
          name: keyName,
          rule: [],
          is_show_tag: 1,
          is_require: 1,
          is_disable: 0,
        },
      ];
    },
    dateTimeList(name,name_en,name_tc, keyName) {
      return [
        {
          type: "datetime",
          title_zh: name,
          title_en: name_en,
          title_tc: name_tc,
          name: keyName,
          rule: [],
          is_show_tag: 1,
          is_require: 1,
          is_disable: 0,
        },
      ];
    },
    selectList(name,name_en,name_tc, keyName) {
      return [
        {
          type: "select",
          title_zh: name,
          title_en: name_en,
          title_tc:name_tc,
          name: keyName,
          rule: [],
          is_show_tag: 1,
          is_require: 1,
          is_disable: 0,
          options: [],
        },
      ];
    },
    HKOther(name,name_en,name_tc, type) {
      // 1见面 2网上  0全部
      type = type ?? 0;
      var web = {
        web: [
          {
            name_zh: this.$t('Hopen.addPage.zh.56cjejxebjw0'),
            name_en: this.$t('Hopen.addPage.en.56cjejxebjw0'),
            name_tc: this.$t('Hopen.addPage.tc.56cjejxebjw0'),
            type: "1",
            url_path: "CounterAddress",
            user_type: this.pageType,
            branch: {},
            fields: [],
          },
          {
            name_zh: this.$t('Hopen.addPage.zh.56cjejxeb6o0'),
            name_en: this.$t('Hopen.addPage.en.56cjejxeb6o0'),
            name_tc: this.$t('Hopen.addPage.tc.56cjejxeb6o0'),
            type: "1",
            url_path: "CounterOrder",
            user_type: this.pageType,
            bottom_tip_zh: "",
            bottom_tip_en: "",
            bottom_tip_tc: "",
            branch: {},
            fields: [
              ...this.selectList(
                this.$t('Hopen.addPage.zh.56cjejxebqo0'),
                this.$t('Hopen.addPage.en.56cjejxebqo0'),
                this.$t('Hopen.addPage.tc.56cjejxebqo0'),
               "sceneId"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxebz00'),
                this.$t('Hopen.addPage.en.56cjejxebz00'),
                this.$t('Hopen.addPage.tc.56cjejxebz00'),
               "name"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxec5k0'),
                this.$t('Hopen.addPage.en.56cjejxec5k0'),
                this.$t('Hopen.addPage.tc.56cjejxec5k0'),
               "contact"),
              ...this.dateTimeList(
                this.$t('Hopen.addPage.zh.56cjejxecc00'),
                this.$t('Hopen.addPage.en.56cjejxecc00'),
                this.$t('Hopen.addPage.tc.56cjejxecc00'),
               "appointDate"),
              ...this.dateTimeList(
                this.$t('Hopen.addPage.zh.56cjejxecis0'),
                this.$t('Hopen.addPage.en.56cjejxecis0'),
                this.$t('Hopen.addPage.tc.56cjejxecis0'),
               "appointTime"),
            ],
          },
        ],
      };
      var local = {
        local: [
          {
            name_zh: this.$t('Hopen.addPage.zh.56cjejxecpc0'),
            name_en: this.$t('Hopen.addPage.en.56cjejxecpc0'),
            name_tc: this.$t('Hopen.addPage.tc.56cjejxecpc0'),
            type: "1",
            url_path: "OnlineAddress",
            user_type: this.pageType,
            fields: [],
            branch: {},
            top_tip_zh: "",
            top_tip_en: "",
            top_tip_tc: "",
          },
          {
            name_zh: this.$t('Hopen.addPage.zh.56cjejxeb040'),
            name_en: this.$t('Hopen.addPage.en.56cjejxeb040'),
            name_tc: this.$t('Hopen.addPage.tc.56cjejxeb040'),
            type: "1",
            url_path: "OnlineRemit",
            user_type: this.pageType,
            bottom_tip_zh: "",
            bottom_tip_en: "",
            bottom_tip_tc: "",
            branch: {},
            fields: [
              ...this.selectList(
                this.$t('Hopen.addPage.zh.56cjejxecw80'),
                this.$t('Hopen.addPage.en.56cjejxecw80'),
                this.$t('Hopen.addPage.tc.56cjejxecw80'),
                 "chargeCurrency"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxed2w0'),
                this.$t('Hopen.addPage.en.56cjejxed2w0'),
                this.$t('Hopen.addPage.tc.56cjejxed2w0'),
                 "chargeAmount"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjktxvdgw1'),
                this.$t('Hopen.addPage.en.56cjktxvdgw1'),
                this.$t('Hopen.addPage.tc.56cjktxvdgw1'),
                 "bankName"),
              ...this.inputList(
                this.$t('Hopen.addPage.zh.56cjejxed9c0'),
                this.$t('Hopen.addPage.en.56cjejxed9c0'),
                this.$t('Hopen.addPage.tc.56cjejxed9c0'),
                 "chargeAccount"),
              ...this.uploadList(
                this.$t('Hopen.addPage.zh.56cjejxedfs0'),
                this.$t('Hopen.addPage.en.56cjejxedfs0'),
                this.$t('Hopen.addPage.tc.56cjejxedfs0'),
                 "chargeVoucher"),
            ],
          },
        ],
      };
      var obj =
        type == 0
          ? Object.assign({}, web, local)
          : type == 1
          ? Object.assign({}, web)
          : Object.assign({}, local);
      var list = {
        name_zh: name,
        name_en: name_en,
        name_tc: name_tc,
        type: "1",
        url_path: "verification"+(type==1?'?type=local':(type==2?'?type=web':'')),
        user_type: this.pageType,
        branch: Object.assign({}, obj),
      };
      return list;
    },
  },
};
</script>
<style lang="scss" scoped>
.el-textarea {
  margin-bottom: 10px;
}
>>>.image-slot{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background: #f5f7fa;
    color: #909399;
    font-size: 30px;
}
</style>